<template>
  <!-- 收货地址 -->
  <div class="form-box">
    <el-table height="55vh" :data="list" stripe border>
      <el-table-column label="序号" type="index" width="60" align="center" />
      <el-table-column label="收货人" prop="name" width="150" align="center" />
      <el-table-column label="电话" prop="phone" width="150" align="center" />
      <el-table-column label="收货地址" prop="address" min-width="160" align="center" />
    </el-table>
    <pagination class="page-view" v-show="totalNum > 0" :total="totalNum" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
  </div>

</template>

<script>
import { listAddr } from "@/api/vip/vip";

export default {
  name: 'FormView',
  props: {
    queryParams: {
      type: Object,
    },
  },

  data() {
    return {
      loading: false,
      list: [],
      totalNum: 0
    }
  },
  watch: {
    // "queryParams": {
    //   deep: true,
    //   handler: function (newV, oldV) {

    //     if (this.pageNum == newV.pageNum) {
    //       this.handleQuery();
    //     } else {
    //       this.pageNum = newV.pageNum;
    //     }
    //   },
    // },
  },

  created() {
    this.getList();
  },

  methods: {
    getList() {
      this.loading = true;
      listAddr(this.queryParams).then((response) => {
        if (response.code == 200) {
          this.list = response.data;
          this.totalNum = response.total;
        }
        this.loading = false;
      });
    }
  }
}
</script>
<style scoped>
.page-view {
  margin-top: 10px;
  height: 50px;
}
</style>